$(function () {
    // 1. 表单校验
    // 用户名: 非空， 2-6位
    // 密码：非空  6-12位
    //使用表单校验插件
    $('.login-form').bootstrapValidator({
        //1. 指定不校验的类型，默认为[':disabled', ':hidden', ':not(:visible)'],可以不设置
        excluded: [':disabled', ':hidden', ':not(:visible)'],

        //2. 指定校验时的图标显示，默认是bootstrap风格
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },

        //3. 指定校验字段
        fields: {
            //校验用户名，对应name表单的name属性
            username: {
                validators: {
                    //不能为空
                    notEmpty: {
                        message: '用户名不能为空'
                    },
                    //长度校验
                    stringLength: {
                        min: 2,
                        max: 6,
                        message: '用户名长度必须在2-6之间'
                    },
                    //拓展一个 提示信息
                    callback: {
                        message: '用户名不存在！'
                    }
                }
            },
            password: {
                validators: {
                    //不能为空
                    notEmpty: {
                        message: '密码不能为空'
                    },
                    //长度校验
                    stringLength: {
                        min: 6,
                        max: 12,
                        message: '密码长度必须在6-12之间'
                    },
                    callback: {
                        message: '密码错误！'
                    }
                }
            }

        }
    })

    // 2- 重置表单校验样式
    // 1-点击重置按钮 
    // 2-通过插件实例 调用表单重置方法 
    $('.btn-reset').click(function () {
        $('.login-form').data('bootstrapValidator').resetForm();
    });

    // 3-用户登陆
    // 1- 点击登陆按钮， 校验表单数据是否合理， 在数据合理情况下，  获取表单的数据 ， 通过ajax发送给后台
    // 2- 后台根据前端传递信息 进行登陆校验， 返回登陆结果
    // 3- 前端接收登陆结果： 
    //   成功：跳转到首页 
    //   失败：重新登陆，提示错误原因 
    // 插件提供 一个事件： success.form.bv 事件 ,会在用户点击提交按钮，并且数据校验通过时触发 
    $('.login-form').on('success.form.bv', function (e) {
        e.preventDefault(); //阻止表单默认提交
        
        // ajax发送请求，进行登陆验证 
        $.ajax({
            type: 'post',
            url: '/employee/employeeLogin',
            data: $('.login-form').serialize(),
            dataType: 'json',
            success: function (res) {
                console.log(res);
                if (res.success) {
                    // 跳转到首页 
                    location.href = './index.html';
                }

                //失败
                if (res.error == 1000) {
                    //  把用户名的状态 由成功改为失败 
                    //  updateStatus(字段name属性， 状态， 提示信息)
                    $('.login-form').data('bootstrapValidator').updateStatus('username', 'INVALID', 'callback');
                }

                if (res.error == 1001) {
                    //  把密码的状态 由成功改为失败 
                    $('.login-form').data('bootstrapValidator').updateStatus('password', 'INVALID', 'callback');
                }
            }
        })
    })
})